<template>
	<view class="layout">
		<button class="take" @click="takePhoto">拍照或本地上传</button>
		<image class="algout" v-if="imagePath" :src="imagePath" mode="widthFix" @click="onPreview"></image>
	</view>
</template>

<script setup>
import {ref} from "vue"
import { pathToBase64, base64ToPath } from 'image-tools'
const imagePath = ref("")
const file_base64 = ref("")
const obj = ref("")
const server_token = ref("db140af0-c1b8-11ee-b115-0242ac110003")
const onPreview = function(){
	uni.previewImage({
		urls:[imagePath.value]
	})
}
const takePhoto = async () => {
uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['camera', 'album'],
					success: (res) => {
						const tempFilePaths = res.tempFilePaths;
						pathToBase64(tempFilePaths[0])
							.then(base64 => {
								let base64String = base64.substring(base64.indexOf(',') + 1)
								//console.log('base64String', base64String)
								file_base64.value = base64String
								uni.showLoading({
									title: '加载中'
								});
								uni.request({
									url:"https://rd.aitestgo.com/run/JQFind",
									data:{
										"data":[
											server_token.value,
											{
											"data":"data:image/jpeg;base64,"+base64String,
											"name":"p1.jpg",
										}]},									
									method:"POST",
									success:res=>{
										//console.log(res.data.data)
										obj.value = res.data.data[0]
										imagePath.value=res.data.data[0]["imgUrl"]
										//let newShowHeight = res.data.data[0]["height"]*750/res.data.data[0]["width"]
										//imageStyle.height = `${newShowHeight}rpx`;
										//console.log("image_width:", res.data.data[0]["width"])
										//console.log("image_height:", res.data.data[0]["height"])										
									},
									fail:(e) => {
									        console.log(e);
									    },
									complete: ()=> {
										uni.hideLoading();
									}
									
								})
							})
							.catch(error => {
								console.error(error)
							})
					}
				})
};
</script>

<style lang="scss" scoped>
.layout{
	
	width: 100%;	
	.take{
		border-radius: 10px;
		//background: paleturquoise;
	}
	.algout{
		width:100%;	
	}
}
</style>
